<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /*css注释不要用双横杠，会导致css异常的*/
        /*选择器 {声明块(包含各种声明)}*/
        /*元素选择器*/
        /*
        h1 {
            color: green;
            font-size: 20px;
        }
        */


        /**类选择器*/
        .p1 {
            color: red;
        }

        .p2 {
            color: green;
        }

        .big {
            font-size: 100px;
        }
        /*id选择器  ,id>类选择器 */
        #lowB {
            color: blue;
            font-size: 10px;
        }
    </style>
</head>
<body>
<h1 id="lowB" class="big">11111111111111111111</h1>
<h2>11111111111111111111</h2>
<h3>11111111111111111111</h3>
<h4>11111111111111111111</h4>

<div>
    <p class="p1">1111111111111111111111111</p>
    <p class="p1">2222222222222222222222222</p>
    <p class="p1">3333333333333333333333333</p>
    <span class="p2 big">span</span>
    <p class="p2">4444444444444444444444444</p>
    <p class="p2">5555555555555555555555555</p>
    <p class="p2">6666666666666666666666666</p>
</div>

</body>
</html>